<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>OA管理系统</title>
    <link rel="stylesheet"  th:href="@{layui/css/layui.css}">
    <script  th:src="@{layui/layui.js}"></script>
    <script th:src="@{jquery/jquery-3.6.4.min.js}"></script>
    <link rel="stylesheet" th:href="@{bootstrap/css/bootstrap.css}">
    <script th:src="@{bootstrap/js/bootstrap.js}"></script>
    <style>
        .prohibitpay{
            background-color: gray;
        }
        .permitpay{
            background-color: rgb(55, 125, 251)
        }

    </style>
    <script>
        $(document).ready(function(){
            $("input[type=checkbox]").click(function(){
                  return false;
            })

            $("#xycheck").click(function(){

                if($("#xycheck").is(":checked")){
                    $("#buy").removeClass("prohibitpay");
                    $("#buy").addClass("permitpay");
                }else{
                    $("#buy").removeClass("permitpay");
                    $("#buy").addClass("prohibitpay");
                }
            });
            $("#xycheck").click(function(){
                if($("#xycheck").is(":checked")){
                    $("#buy").removeClass("prohibitpay");
                    $("#buy").addClass("permitpay");
                }else{
                    $("#buy").removeClass("permitpay");
                    $("#buy").addClass("prohibitpay");
                }
            });
            var userId=$("#i1").val()
            var buyType=$("#i2").val()
            $("#buy").click(function(){
                if($("#xycheck").is(":checked")){
                    layer.open({
                        type: 2,
                        title: '付款',
                        shadeClose: true,
                        shade: 0.8,
                        area: ['90%', '90%'],
                        content: '/QrCode/build?userId='+userId+"&buyType="+buyType,
                    });
                }

            });
            $("#xya").click(function(){
                layer.open({
                    title: '协议',
                    type: 1,
                    shadeClose: true,
                    content:"<div>晨光财经终端 软件最终用户许可协议<br/>" +
                        "<br/>" +
                        "重要须知━请认真阅读：本《最终用户许可协议》（以下称《协议》）是您与 沈阳易诚金软科技有限公司 之间有关上述晨光财经终端软件产品的法律协议。<br/>" +
                        "本“软件产品”包括计算机软件，并可能包括相关印刷材料或电子文档。本“软件产品”还包括 沈阳易诚金软科技有限公司 提供给您的原“软件产品”的任何更新和补充资料。您一旦安装、复制、下载、访问或以其它方式使用“软件产品”，即表示您同意接受本《协议》各项条款的约束。<br/>" +
                        "<br/>" +
                        "软件产品许可证<br/>" +
                        "<br/>" +
                        "本“软件产品”受著作权法及国际著作权条约和其它知识产权法和条约的保护。本“软件产品”只许可出售，未经授权不得擅自拷贝和传播软件的全部或部分内容，不得擅自进行修改，否则将受到严厉的法律制裁。<br/>" +
                        "<br/>" +
                        "1．许可证的授予。本《协议》授予您下列权利：<br/>" +
                        "．应用软件。您可安装、使用、访问、显示、运行软件。<br/>" +
                        "<br/>" +
                        "2．其它权利和限制的说明。<br/>" +
                        "．商标。本《协议》不授予您有关任何晨光财经终端商标或服务商标的任何权利。  <br/>" +
                        "．出租。不得出租、租赁或出借本“软件产品”。<br/>" +
                        "．支持服务。沈阳易诚金软科技有限公司为您提供与“软件产品”有关的“支持服务”。支持服务的使用受用户手册、“联机”文档或其它提供的材料中所述的各项政策和计划的制约。<br/>" +
                        "．软件转让。本\"软件产品\"的第一被许可人不可以对本《协议》及“软件产品”直接或间接向任何用户作转让。<br/>" +
                        "．终止。如您未遵守本《协议》的各项条款和条件，在不损害其它权利的情况下，沈阳易诚金软科技有限公司可终止本《协议》，您必须销毁“软件产品”的所有副本及其所有组成部分。<br/>" +
                        "<br/>" +
                        "3．升级版本。如本“软件产品”标明为升级版本，您必须获取沈阳易诚金软科技有限公司标明为合格升级版本的产品来升级本“软件产品”。<br/>" +
                        "<br/>" +
                        "4．服务内容的版权。公司的软件产品均受版权保护，用户不能擅自复制、随意发布相关服务内容，不得根据服务内容，改造或创造与服务内容有关的派生产品，不得将公司提供的数据和信息内容向他人发布并收取不正当的费用。<br/>" +
                        "<br/>" +
                        "5. 产品风险提示<br/>" +
                        ". 用户应充分认识到证券投资的风险。公司所提供的所有数据与信息，仅供用户参考使用，不构成用户进行投资操作的直接依据，用户据此操作，风险自担，公司不承担任何经济和法律责任。<br/>" +
                        ". 公司通过软件产品为用户提供财经金融资讯和行情数据信息，并通过相关数据分析系统、统计运算模型对上述资讯和数据进行整理、加工和集成，为用户提供高附加值的信息和数据服务，（该信息及数据服务均是根据数据模型自动生成，不存在人为的操控或操纵），以利于用户在投资过程中理性决策、控制风险。用户在使用软件产品过程中，对于公司提供的信息数据内容，用户不应将其视作公司明示、默示地承诺证券、期货的投资收益，不应将其视为具体证券品种选择/买卖时机的建议，不应将其视为对证券市场/证券品种的走势、投资证券的可行性的分析、预测或建议，或任何其他形式的证券投资咨询/建议。公司对用户的投资决策可能带来的风险或损失不承担任何违约、赔偿或其他民事责任。<br/>" +
                        "<br/>" +
                        "6. 免责条款<br/>" +
                        ". 在服务期内，公司将有权根据经营活动的需要，随时对软件产品的服务内容进行更新、增加或删除，且无需另行通知或取得用户的同意。<br/>" +
                        ". 公司尽力提供完整、及时、准确的信息，但不对所提供信息的完整性、及时性、准确性承担任何责任。<br/>" +
                        ". 公司全力保障信息的优质传输，但对因证券交易所、卫星传输线路、电信部门及网络服务提供商、上市公司信息提供商等任何原因造成的信息传递异常情况所致后果不承担任何法律责任。<br/>" +
                        ". 由于地震、台风、战争、罢工、政府行为、瘟疫、爆发性和流行性传染病或其他重大疫情、各方原因造成的火灾、基础电信网络中断造成的及其它各方不能预见并且对其发生后果不能预防或避免的不可抗力原因，致使相关服务中断，公司不承担由此产生的损失，但应及时通知服务中断原因，并积极加以解决。<br/>" +
                        ". 在适用法律所允许的最大范围内，沈阳易诚金软科技有限公司在任何情况下绝不就使用“软件产品”或“提供支持服务”所发生的非直接的或间接的损失（包括，但不限于营业利润损失或任何其他金钱上的损失）承担赔偿责任。在任何情况，沈阳易诚金软科技有限公司,以《协议》条款下所承担的责任，以不多于购买“软件产品”实际已付的价款为准。但是，如果您已经与沈阳易诚金软科技有限公司达成支持服务协议，沈阳易诚金软科技有限公司就支持服务的全部赔偿责任应以该支持服务协议条款为准。<br/>" +
                        "<br/>" +
                        "本《协议》受中华人民共和国法律管辖。<br/>" +
                        "<br/>" +
                        "保留权利。未明示授予的一切其它权利均为沈阳易诚金软科技有限公司所有。<br/>" +
                        "<br/>" +
                        "如果您对本《协议》有什么问题，请同 沈阳易诚金软科技有限公司 联系，电话：024-31180923 ，官网：www.xlxtj.com 。</div>"
                });
            });
        });
    </script>
</head>
<body>
<div class="container">
    <input style="display: none" th:value="${userId}" id="i1">
    <input style="display: none"   th:value="${buyType}" id="i2">
    <div style="background-color: rgb(242, 242, 242);height: 40px;line-height: 40px;text-align: center; font-size: 15px;">
        <span>购买指导： 选择产品</span>
        <span class="glyphicon glyphicon-arrow-right"></span>
        <span> 扫码支付</span>
        <span class="glyphicon glyphicon-arrow-right"></span>
        <span> 支付成功，立即使用</span>
    </div>
    <div
            style="display: flex;  justify-content: space-between;height: 50px;line-height: 50px;font-size: 16px;font-weight: 1000;">
        <div style="display: flex;">
            <div style="">账号 &nbsp; : &nbsp;</div>
            <div style="line-height: 50px;color: rgb(55, 121, 255);" th:text="${userId}"></div>
        </div>
<!--        <div>开具发票</div>-->
    </div>
    <div style="border: 1px blue solid;height: 425px;">
        <div style="display: flex;height: 40px;line-height: 40px;font-size: 16px;">
            <div style="background-color: rgb(224, 235, 254);width: 50%;text-align: center;">产品</div>
            <div style="background-color: rgb(224, 235, 254);width: 50%;text-align: center;">期限</div>
        </div>
        <div style="display: flex;height:200px;">
            <div style="width: 50%;border: 1px solid;border-color: rgb(205, 222, 254)">
                <div class="xdiv"><input type="checkbox" checked> <span>晨光财经终端标准版</span></div>
<!--                <div class="xdiv"><input type="checkbox"> <span>大智慧365</span></div>-->
<!--                <div class="xdiv"><input type="checkbox"><span>大智慧专业版</span></div>-->
            </div>
            <div style="width: 50%;border: 1px solid;border-color: rgb(205, 222, 254);position: relative;">
						<span style="font-size: 15px; font-weight: 200;position: absolute;top: 10px;left: 10px;">
							<input type="radio" name="ss" checked>
							<span style="position: relative;top: -4px;">
								1年
							</span>
						</span>
<!--                <span style="font-size: 15px; font-weight: 200;position: absolute;top: 10px;left: 70px;">-->
<!--							<input type="radio" name="ss">-->
<!--							<span style="position: relative;top: -4px;">-->
<!--								2年-->
<!--							</span>-->
<!--						</span>-->

                <span th:if="${userType} eq '0'"  style="font-size: 15px;position: absolute;right: 10px;top: 10px;">价格：365/年</span>
                <span th:if="${userType} eq '1'"  style="font-size: 15px;position: absolute;right: 10px;top: 10px;">价格：980/年</span>
            </div>
        </div>
        <div style="height: 100px;position: relative;">
            <div
                    style="position: absolute;right: 10px;top:10px;display: flex; font-size: 18px;width:150px;justify-content: space-between;">
                <div>总计：</div>

                <div>
                    <span th:if="${userType} eq '0'" style="color: rgb(55, 125, 251);">365</span>
                    <span th:if="${userType} eq '1'"  style="color: rgb(55, 125, 251);">980</span>
                    <span>元</span>
                </div>
            </div>
            <div
                    style="position: absolute;right:10px;top:50px;display: flex;font-weight: 100;font-size: 12px;width:150px;justify-content: space-between;">
                <div>已优惠:</div>
                <div>0</div>
            </div>
        </div>
        <div style="height: 100px;">
            <div class="permitpay" id="buy"
                    style="top: 118px;width:80% ;height:50px;text-align:center;margin-left: 10%;line-height: 50px;font-size: 20px;color: #fff;">
                <span>立即购买 ▷</span>
            </div>
        </div>
    </div>
    <div
            style="background-color: rgb(244, 244, 244);width: 525px;height: 50px;line-height: 50px;padding-left: 20px;font-size:16px;">
        <a href="#" id="xya">使用软件许可协议</a>
        <span class="xdiv"><input type="checkbox" id="xycheck" checked> <span>我已仔细阅读相关协议，对其内容表示确认</span></span>
    </div>
    <div style="background-color: white;font-size: 15px;">
        <div style="margin-left: 20px;margin-top: 10px;">如遇到支付问题，可随时拨打 <strong>024-31180931</strong>
            ，客服将第一时间帮你解决</div>
        <div style="margin-left: 20px;margin-top: 10px;">如需了解详情可点击进入易诚金软官网 https://xlxtj.com</div>
    </div>
</div>

</body>
</html>